<template>
	<view class="page-box">
		<view class="order" v-for="(item, rindex) in orderList" :key="rindex">
			<view class="top">
				<view class="left">
					<u-icon name="home" :size="30" color="rgb(94,94,94)"></u-icon>
					<view class="store">{{ item.store_name || '自营' }}</view>
					<u-icon name="arrow-right" color="rgb(203,203,203)" :size="30"></u-icon>
				</view>
				<view class="right">{{ getStatusText(item.refund_status) }}</view>
			</view>
			<view class="item"	@click="gotoOrderDetails(item)">
				<view class="left"><image :src="photo_base_url + item.goods_cover" mode="aspectFill"></image></view>
				<view class="content">
					<view class="title u-line-2">{{ item.goods_name }}</view>
					<view class="type">{{ item.goods_option_title }}</view>
				</view>
				<view class="right">
					<view class="price">
						￥{{ priceInt(fenZhuanYuan(item.sell_price)) }}
						<text class="decimal">.{{ priceDecimal(fenZhuanYuan(item.sell_price)) }}</text>
					</view>
					<view class="number">x{{ item.total }}</view>
				</view>
			</view>
			<view class="total">
				实付:
				<text class="total-price">
					￥{{ priceInt(fenZhuanYuan(item.paid)) }}.
					<text class="decimal">{{ priceDecimal(fenZhuanYuan(item.paid)) }}</text>
				</text>
			</view>
			<view style="height: 20upx;"></view>
			<view class="tips-table">
				<view class="title">{{getRefundTypeText(item.refund_type)}}</view>
				<view class="remark">￥ {{fenZhuanYuan(item.apply_money)}}</view>
				<view class="status">{{getApplyText(item.refund_status)}}</view>
			</view>
			<view class="bottom">
				<view class="more">
					<!-- 更多 -->
				</view>
				<view class="btns">
					<view class="btn" @click="openLogistics(item)">查看详情</view>
				</view>
			</view>
		</view>
		<u-loadmore :status="loadStatus" bgColor="#f2f2f2"></u-loadmore>
	</view>
</template>

<script>
	export default {
		name:'member-order-service',
		data() {
			return {
				orderList:[],
				orderPage:0,
				orderEnd:false,
				photo_base_url:'',
				loadStatus: 'loading',
				tmpIdx: 0,
				next_status_text: [],
				status_text: [],
				refund_type_text: [],
			};
		},
		computed: {
			// 价格小数
			priceDecimal() {
				return val => {
					if (val !== parseInt(val)) return val.slice(-2);
					else return '00';
				};
			},
			// 价格整数
			priceInt2() {
				return val => {
					if (val !== parseInt(val)) return val.split('.')[0];
					else return val;
				};
			}
		},
		onLoad() {
			this.reloadOrderList();
		},
		onReachBottom() {
			this.getOrderList(this.tmpIdx)
		},
		methods: {
			// 价格整数
			priceInt(val){
				if (val !== parseInt(val)) return val.split('.')[0];
				else return val;
			},
			reloadOrderList(){
				this.orderPage = 0
				this.orderEnd = false
				this.loadStatus = 'loading'
				this.getOrderList(this.tmpIdx)
			},
			// 页面数据
			getOrderList(idx) {
				const that = this
				if (that.orderEnd){
					return
				}
				that.tmpIdx = idx
				that.orderPage++
				that.$api.member.myRefundList({
					page:that.orderPage,
					}).then(res => {
					that.orderList = that.orderList.concat(res.list)
					that.photo_base_url = res.photo_base_url
					that.status_text = res.status_text
					that.refund_type_text = res.refund_type_text
					if (res.page_info.has_more){
						that.loadStatus = 'loadmore'
					} else{
						that.orderEnd = true
						that.loadStatus = 'nomore'
					}
				})
			},
			// 总价
			totalPrice(item) {
				let price = 0;
				item.map(val => {
					price += parseFloat(val.sell_price * val.total);
				});
				return this.fenZhuanYuan(price);
			},
			// 总件数
			totalNum(item) {
				return 0
				let num = 0;
				item.map(val => {
					num += val.total;
				});
				return num;
			},
			fenZhuanYuan(_price){
				return (_price / 100).toFixed(2)
			},
			getStatusText(_status){
				if(this.status_text[_status]){
					return this.status_text[_status]
				} else {
					return '未知'
				}
			},
			getRefundTypeText(_status){
				if(this.refund_type_text[_status]){
					return this.refund_type_text[_status]
				} else {
					return '未知'
				}
			},
			getApplyText(_status){
				switch (_status){
					case 1:
						return '待处理'
					case 2:
						return '驳回'
					default:
						return '同意'
				}
			},
			gotoOrderDetails(_row){
				console.log(_row)
				this.$myRouter.push({name:'member/order_details',params:{id:_row.id}})
			},
			openLogistics(_row){
				this.$myRouter.push({name:'member/order_aftersale',params:{sid:_row.id}})
			}
		}
	};
	</script>
	<style lang="scss" scoped>
		@import '@/static/css/member_order_list.scss';
		.page-box{
			padding-bottom: 30rpx;
		}
		.total-price{
			color: #E41F19;
			font-weight: 700;
		}
		.logistics-box{
			// padding: 30rpx 30rpx 0;
			overflow: hidden;
			
			.title{
				font-size: 32rpx;
				height: 100rpx;
				line-height: 100rpx;
				padding-left: 30rpx;
				border: 1px solid #CCC;
			}
		}
	</style>